<!DOCTYPE html>
<html ng-app>

<head lang="en">
    <meta charset="UTF-8">
    <title>教师主页</title>
    <link href="./css/bootstrap.min.css" rel="stylesheet">
    <link href="./css/font-awesome.css" rel="stylesheet">
    <link href="./css/main.css" rel="stylesheet">
    <script src="./js/jquery.min.js"></script>
    <script src="./js/bootstrap.min.js"></script>
    <script src="./js/jquery.pin.js"></script>
	<script src="js/angular.min.js"></script>
</head>

<body ng-controller="teacher">

    <!--导航栏-->
    <div class="navbar navbar-njust navbar-fixed" role="navigation">
        <div class="container clearfix">
            <div class="navbar-header">

                <div class="navbar-brand">
                    <i class="fa fa-cubes"></i>
                    <h4 id="maintitle">课程考试系统</h4>
                </div>
            </div>

            <div class="navbar-collapse collapse">

                <ul class="nav navbar-nav" style="margin-left:200px">
                    <li class="pull-left">
                        <a href="home.html">首页</a>
                    </li>
                    <li class="pull-left active">
                        <a href="teacher.html#">教师页面</a>
                    </li>
                    <li class="pull-left">
                        <a href="EditExam.html">新建考试</a>
                    </li>
					<li class="pull-left">
                        <a href="questionbank.html">增加题目</a>
                    </li>
                </ul>
                <div class="list-unstyled pull-right clearfix dropdown" style="margin-top:25px">
                    <li class="dropdown-toggle " id="dropdownMenu1" data-toggle="dropdown">
                        <a href="" style="width:200px">欢迎您，<span id="username">{{teacher.name}}</span>老师</a>
                    </li>
                    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                        <li role="presentation"><a role="menuitem" tabindex="-1" href="teacherEditInfo.html">我的账户</a>
                        </li>
                        <li role="presentation"><a id="logoutBtn" role="menuitem" tabindex="-1" href="home.html">注销</a>
                        </li>
                    </ul>

                </div>
            </div>
        </div>

    </div>
    

    <div class="container" id="main-wrapper">
        <div class="bs-sidebar hidden-print toc affix-top list-group" data-spy="affix" data-offset-top="120" role="complementary">
            <div class="nav bs-sidenav pinned" style="width:210px;margin-top:50px">

                <a class="item-l1 list-group-item" href="#info">个人信息</a>


                <a class="item-l2 list-group-item" href="#course">我的课程</a>


                <a class="item-l3 list-group-item" href="#exam">我的考试</a>

            </div>
        </div>
        <div class="content-body" role="main">
            <h1 id="info">个人信息</h1>
            <p>教师工号 : <span id = "userid">{{teacher.teacherNo}}</span></p>
            <p>所属学院 : <span id = "usercollege">{{teacher.college}}</span></p>
            <p>教师姓名 : <span id = "usernamer">{{teacher.name}}</span></p>
            <p>联系方式 : <span id = "usercontact">{{teacher.contact}}</span></p>

            <h1 id="course">我的课程</h1>
            <table>
                <thead>
                    <tr>
                        <th>课程ID</th>
                        <th>课程名称</th>
                        <th>选课学生</th>
                    </tr>
                </thead>
                <tbody id="courseTable">
                    <tr ng-repeat="course in courses">
                        <td>{{course.courseNo}}</td>
                        <td>{{course.courseName}}</td>
                        <td><a href="" data-toggle="modal" data-target="#myModal"
							ng-click="getStudent(course.courseNo)">查看详细</a>
                        </td>
                    </tr>
                </tbody>
            </table>

            <h1 id="exam">我的考试</h1>
            <table>
                <thead>
                    <tr>
                        <th>考试ID</th>
                        <th>课程名称</th>
                        <th>考试名称</th>
                        <th>考试时间</th>
                        <th>考试状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="exam in exams">
                        <td>{{exam.examNo}}</td>
                        <td>{{exam.courseNo}}</td>
                        <td>{{exam.examName}}</td>
                        <td>{{exam.startTime}}</td>
                        <td>{{exam.state}}</td>
                        <td><a href="{{exam.href}}">{{exam.option}}</a></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
	
	
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" 
		aria-hidden="true" > <!--查看学生-->
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel">选课学生</h4>
                </div>
                <div class="modal-body" role="main">
                    <table>
						<thead>
							<tr>
								<th class="col-md-5">学号</th>
								<th class="col-md-5">姓名</th>
								<th>年级</th>
							</tr>
						</thead>
						<tbody>
							<tr ng-repeat="student in students">
								<td class="col-md-5">{{student.studentNo}}</td>
								<td class="col-md-5">{{student.name}}</td>
								<td>{{student.grade}}</td>
							</tr>
						</tbody>
					</table>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>


    <script>
        $(".pinned").pin({containerSelector: ".container"});

    </script>

    <!--页脚-->
    <footer class="footer clearfix">
        <div class="container">
            <ul class="list-unstyled list-inline pull-left">
                <li>
                    <a href="#">FAQ</a>
                </li>
                <li>
                    <a href="#">Git</a>
                </li>
                <li>
                    <a href="#">Blog</a>
                </li>
            </ul>
            <p class="pull-right">@ 2014 软件项目管理团队</p>

        </div>
    </footer>
<!--script type="text/javascript">
window.onload = function(){
    var user;
    getSessionUser();
    $.getJSON("teacher!getSessionUserInfo.action",{},function(data){
        
         getCourse(data.curilist); 

    });
}

function getSessionUser(){
    $.getJSON("teacher!getSessionUser.action",{},function(data){
        user = data.user;
        document.getElementById('username').innerHTML = user.name;
        document.getElementById('userid').innerHTML = user.teacherNo;
        document.getElementById('usercollege').innerHTML = user.college;
        document.getElementById('usernamer').innerHTML = user.name;
        document.getElementById('usercontact').innerHTML = user.contact;
    });
};

function getCourse(curi){
    
    var content = "";
    for(var i=0;i<curi.length;i++){
        content += '<tr class="success">'+
        '<td>'+ curi[i].courseNo +'</td>'+
        '<td>'+ curi[i].courseName +'</td>'+
        '<td>'+ ' ' +'</td>'+

        '</tr>';
    }
    if ( curi.length==0 ) content += 'Empty !';
    $("#courseTable").html(content);
}

$("#logoutBtn").click(function (){
        $.post("student!logout.action",
                {
                },
                function(logindata){
                    window.location.href="home.html";
                    
                }
        );
});
</script-->
	<script>
		function teacher($scope,$http){
			var teacher = new Object();
			var exams = new Array();
			var courses = new Array();
			var students = new Array();
			
			$scope.teacher = teacher;
			$scope.exams = exams;
			$scope.courses = courses;
			$scope.students = students;
			
			//set static data
			teacher.teacherNo = "90000"
            teacher.college = "南理工";
            teacher.name = "黄大队"
            teacher.contact = "4008-123-123";
			for(var i = 0;i<1;i++){
				courses[i] =  new Object();
				courses[i].courseNo = "4008";
				courses[i].courseName = "计算机网络";
			}
			for(var i = 0;i<4;i++){
				exams[i] = new Object();
				exams[i].examNo = i+1;
				exams[i].courseNo = "计算机网络";
				exams[i].examName = "计算机网络课程考试" ; 
				exams[i].startTime = "2014.12.17日12:00";
				if ( i==0 ) exams[i].state = "准备中";
				else if ( i==1 ) exams[i].state = "正在进行";
				else exams[i].state = "已结束"; 
				
				if ( exams[i].state == "准备中" ) exams[i].option = "编辑" , exams[i].href = "editExam.html";
				else if ( exams[i].state == "正在进行" ) exams[i].option = "查看" , exams[i].href = "#";
				else if ( exams[i].state == "已结束" ) exams[i].option = "判卷" , exams[i].href = "#"
			}
			
			$scope.getStudent = function(courseNo){
				for(var i=0;i<3;i++){
					students[i] = new Object();
					students[i].studentNo = '91210684054'+i;
					students[i].name = 'hdd';
					students[i].grade = '大二';
				}
			}
			
			$http.get("teacher!getInfo.action").success(function(data){
				$scope.teacher = teacher = angular.copy(data.teacher);
			}).error(function(){
				//alert('wocao fail');
			});
			$http.get("teacher!getExamInfo.action").success(function(data){
				var len = data.exams.length , e = data.exams;
				for(var i=0;i<len;i++){
					var dd = new Date(e[i].startTime.time);
					//alert(dd.toDateString());
					e[i].startTime = dd.toGMTString();
					
					if ( e[i].state=="Pending" ) e[i].option = "编辑" , e[i].href = "editExam.html";
					else if ( e[i].state=="Running" ) e[i].option = "查看" , e[i].href = "#";
					else if ( e[i].state=="END" ) e[i].option = "判卷" , e[i].gref = "#";
				}
				$scope.exams = exams = angular.copy(data.exams);
			}).error(function(){
				//alert('wocao fail');
			});
		}
	</script>

</body>

</html>